<%@ taglib uri="/tld/extremecomponents" prefix="ec" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script src = "../js/jquery-1.12.1.js" type = "text/javascript"></script>
	<script src = "../js/common.js" type = "text/javascript"></script>
	<script src = "../js/highcharts.js"></script>
	<script src = "../js/highcharts-3d.js"></script>
	<script src = "../js/wordcloud.js"></script>
	<script src="../js/exporting.js"></script>
	<script src="../js/export-data.js"></script>
	
    <link rel="stylesheet" href="<%=request.getContextPath() %>/css/fontawesome.min.css"/>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/css/templatemo-style.css"/>
		
	
	<link rel="stylesheet" href="<%=request.getContextPath() %>/css/materialdesignicons-table.min.css"/>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/css/vendor.bundle.base-table.css"/>
    <link rel="stylesheet" href="<%=request.getContextPath() %>/css/style-table.css"/>
		
	<style>
	    div{position:relative;}
			   
	    body{
			background-color:	#FDF5E6;
		}
				
		table{
	   		 margin:0px;
		}
	</style>
<title>首页</title>
</head>

<body  style="overflow-Y: scroll; overflow-x: hidden;" id = "reportsPage">
	<div class="row tm-content-row">
    	<div class="col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-block-col">
        	<div class="tm-bg-primary-dark tm-block" >
            	<h2 class="tm-block-title">作业题目难易度分析</h2>
                <div id="container" style="height:250px;background:#000; color:#FFF">
				
					<script language="JavaScript"><!--
						var allTopic = new Array();
						var allTopicAvg = new Array();
						var allTopicHard = new Array();
						var everyTopicTotalValue= new Array();
						var total=parseFloat('${JOBTOTALSCORER[0].total}');

						for(var i=0;i<everyTopicTotalValue.length;i++){
							everyTopicTotalValue.push("${JOBTOTALSCORER.topic_total_value}");
						}
						for(var i=0;i<allTopic.length;i++){
							allTopic.push("${JOBHARD.topic_name}");  
							allTopicAvg.push("${JOBHARD.avgScorer}");
						}
						/*<c:forEach items="${JOBTOTALSCORER}" var="item" varStatus="status" >  
							everyTopicTotalValue.push("${item.topic_total_value}");
						</c:forEach>
						<c:forEach items="${JOBHARD}" var="item" varStatus="status" >  
							allTopic.push("${item.topic_name}");  
							allTopicAvg.push("${item.avgScorer}");  
						</c:forEach>*/
						for(var i=0;i<allTopicAvg.length;i++){
							var hard =1- parseFloat(allTopicAvg[i])/parseFloat(everyTopicTotalValue[i]);
							hard = Math.round(hard*100)/100; 
							allTopicHard.push(hard);
						}				

						$('#container').highcharts({
							chart: {
								type: 'column'
							},
							title: {
								text: '本次作业题目难易度'
							},
							xAxis: {
								categories: allTopic
							},
							plotOptions: {
								series: {
									allowPointSelect: true
								}
							},
							series: [{
								name: '本次作业各题目难度',
								data: allTopicHard
							}]
						});
					</script>
				</div>
				<button id="jobHard" type="button" style="position:absolute;right:0;bottom:0;"
							 class=" btn-primary " onclick="window.location='jobhard?ActionType=job_Hard_Overall'" >详情</button>
			</div>
                   
		</div>
		<div class="col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-block-col">
        	<div class="tm-bg-primary-dark tm-block" >
            	<h2 class="tm-block-title">作业提交情况分析</h2>
                <div id="container1" style="height:250px;background:#000; color:#FFF"></div>
				<script type="text/javascript">
					var normal=parseFloat('${JOBCOMPLETE[0].normal}');
					var supplementary=parseFloat('${JOBCOMPLETE[0].supplementary}');
					var overdue=parseFloat('${JOBCOMPLETE[0].overdue}');

					Highcharts.chart('container1', {
						chart: {
							plotBackgroundColor: null,
							plotBorderWidth: null,
							plotShadow: false,
							type: 'pie'
						},
						title: {
							text: '本次作业提交情况'
						},
						tooltip: {
							pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
						},
						plotOptions: {
							pie: {
								allowPointSelect: true,
								cursor: 'pointer',
								dataLabels: {
									enabled: false
								},
								showInLegend: true
						    }
					    },
						series: [{
							name: 'Brands',
							colorByPoint: true,
							data: [{
									name: '正常',
									y:normal,
									sliced: true,
									selected: true
									},  {
									name: '未交',
									y:supplementary
									}, {
									name: '补交',
									y:overdue
							}]
						}]
					});
				</script>
          	</div>
            <button id="jobSubmit" type="button" style="position:absolute;right:20px;bottom:0;"
							 class=" btn-primary " onclick="window.location='jobcomplete?ActionType=job_Complete_Status_Overall'" >详情</button>
		</div>
        <div class="col-sm-12 col-md-12 col-lg-12 col-xl-12 tm-block-col">
        	<div class="tm-bg-primary-dark tm-block" >
            	<h2 class="tm-block-title">学生努力程度分析</h2>
                <div id="container2" style="height:250px;background:#000; color:#FFF"></div>
                <script type="text/javascript">
                       	var allName = new Array();
                       	for(var i=0;i<allName.length;i++){
                       		allName.push("${STUDENTISEFFORT.student_name}");
						}
                       	/*<c:forEach items="${STUDENTISEFFORT}" var="item" varStatus="status" >  
                       		allName.push("${item.student_name}");  
				     	</c:forEach>*/
				     	var test=allName.toString();
					   	var lines = test.split(/[,\. ]+/g),
						data = Highcharts.reduce(lines, function (arr, word) {
						var obj = Highcharts.find(arr, function (obj) {
							return obj.name === word;
						});
				        if (obj) {
							obj.weight += 1;
						} else {
							obj = {
						    	name: word,
						    	weight: 1
						    };
						    arr.push(obj);
						}
						return arr;
						}, []);
						
						Highcharts.chart('container2', {
						    series: [{
						    	
						        type: 'wordcloud',
						        data: data,
						        name: '提交次数'
						    }],
						    title: {
						        text: '学生努力程度分析'
						    },
						    tooltip: {
						        pointFormat: false
						    }
						});
					</script>                 
                    </div>
                    <button id="jobSubmit" type="button" style="position:absolute;right:15px;bottom:0;"
							 class=" btn-primary " onclick="window.location='studenteffort?ActionType=student_Is_Effort_Overall'" >详情</button>
                </div>
                 <div class="col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-block-col">
                    <div class="tm-bg-primary-dark tm-block" >
                        <h2 class="tm-block-title">作业相似度分析</h2>
              			  <div  style="height:250px;background:#000; color:#FFF"></div>
						学生相似度前五
						学生相似度后五
						统计最终的相似度
						表格显示即可
                	</div>
                	<button id="jobSimiliar" type="button" style="position:absolute;right:20px;bottom:0;"
							 class=" btn-primary " onclick="window.location='jobhard?ActionType=job_Hard_Overall'" >详情</button>
				</div> 
				 <div class="col-lg-6 grid-margin stretch-card"> 
 			<div class="col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-block-col">
              <div class="tm-bg-primary-dark tm-block card">
                 <h2 class="tm-block-title">作业相似度分析</h2>
                  <h4 class="tm-block-title">本次作业相似度排名前五</h4>
                  <table class="table table-hover" style="background:#F5F5DC">
                    <tbody>
                      <tr>
                        <td><font color="#528B8B">张三</font></td>
                        <td><font color="#528B8B">张二</font></td>
                        <td><font color="#528B8B">张一</font></td>
                        <td><font color="#528B8B">李四</font></td>
                        <td><font color="#528B8B">李五</font></td>
                      </tr>
                    </tbody>
                  </table>
                  <br />
                   <h4 class="tm-block-title margin-top:10px">本次作业相同排名前五</h4>
                   <table class="table table-hover" style="background:#F5F5DC">
                    <tbody>
                      <tr>
                        <td><font color="#528B8B">张三</font></td>
                        <td><font color="#528B8B">张二</font></td>
                        <td><font color="#528B8B">张一</font></td>
                        <td><font color="#528B8B">李四</font></td>
                        <td><font color="#528B8B">李五</font></td>
                      </tr>
                    </tbody>
                  </table>
                </div>
                <button id="jobSubmit" type="button" style="position:absolute;right:20px;bottom:0;"
							 class=" btn-primary " onclick="window.location='jobhard?ActionType=job_Hard_Overall'" >详情</button>
              </div>
             
            </div>
		</div>
	</body>
</html>


